﻿<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>做我女朋友好不好</title>
<!-- style -->
<link type="text/css" rel="stylesheet" href="css/theme.css">
<script src="js/jquery-2.0.3.min.js"></script>
</head>
<body>
<div id="div_container">
	<!-- 最外层div，用于居中兼容PC和移动 -->
	<div id="div_start_bg"></div>
	<div id="div_onlyyou">
		<!-- 用于设置背景 -->
		<div id="div_oy_inner">
			<!-- 用于存放content -->
			<div class="div_oy_text">
				<h1></h1>
				<img class="img_oy_text" src="">
				<p class="p_oy_text"></p>
				<ul id="ul_oy_benefit">
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
					<li class="li_oy_benefit"></li>
				</ul>
			</div>
			<ul id="ul_oy_btn">
				<li onclick="oy_go_next()">Yes&nbsp;&nbsp;❤</li>
				<li onclick="oy_show_benefit()">No&nbsp;&nbsp;✖</li>
			</ul>
			<div id="div_oy_note" onclick="oy_hide_note()">
				<img src="images/emoji_kelian.jpg" alt=""><br>请告诉我Yes！
				<div id="div_oy_note_close">✖</div>
			</div>
			<div id="div_oy_yes">
				<img src="images/emoji_bixin.jpg" alt=""><br>太好了！哈哈~
			</div>
		</div>
	</div>
	<div class="div_pure_words">
		<div class="div_pure_words_bg">
			<div class="div_pure_words_height"></div>
		</div>
		<div class="div_pw_typed">
			<span id="span_pw_typed"></span>
		</div>
	</div>
	<div id="div_btn_container">
		<div id="div_btn_inner">
			<div class="div_music_tips"></div>
			<div class="div_btn" id="div_music" onclick="music_switch()">
				<!-- 音乐按钮部分 -->
				<img id="img_music" src="images/music_note_big.png" style="-webkit-animation:music_play_rotate 1s linear infinite">
				<!-- 您的浏览器不支持播放音乐 -->
				<audio id="audio_music" autoplay="autoplay" loop="loop"><source type="audio/mpeg"/></audio>
			</div>
			<div class="div_record_tips"></div>
			<div class="div_btn" id="div_record" onclick="record_switch()">
				<audio id="audio_record" loop="loop"><source type="audio/mpeg"/></audio>
			</div>
		</div>
	</div>
</div>
<script>
//判断客户端设备，选择写入meta
function init_viewport() {
	if (navigator.userAgent.indexOf('Android') != -1) {
		var version = parseFloat(RegExp.$1);
		if (version > 2.3) {
			var width = window.outerWidth == 0 ? window.screen.width : window.outerWidth;
			var phoneScale = parseInt(width) / 500;
			document.write('<meta name="viewport" content="width=500, minimum-scale = ' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-densitydpi=device-dpi">');
		} else {
			document.write('<meta name="viewport" content="width=500, target-densitydpi=device-dpi, user-scalable=0">');
		}
	} else if (navigator.userAgent.indexOf('iPhone') != -1) {
		var phoneScale = parseInt(window.screen.width) / 500;
		document.write('<meta name="viewport" content="width=500, min-height=750, initial-scale=' + phoneScale + ', maximum-scale=' + phoneScale + ', user-scalable=0" /> '); //0.75   0.82
	} else {
		document.write('<meta name="viewport" content="width=500, height=750, initial-scale=0.64" /> '); //0.75  0.82
	}
}
init_viewport();

var theme = 'pure_words';
console.log('theme ->' + theme);
var theme_content = {
	"pure_words_content": "遇见你是我所有美好故事的开始，所以，请别放开我的手，也别缺席我的将来，因为一辈子和你在一起才叫将来<um style='color: #F44336;'>💕</um>",
	"typed_bool": "typed_y",
	"cursor_char": "cursor_heart",
	"bg_style_pure_words": "bg_opacity",
	"bg_img": "images/3.jpg",
	"simple_page_content": "",
	"video_page_content": ""
};
console.log(theme_content);

var music_json = {
	"music_select": "m_online",
	"m_online_id": "7",
	"m_online_url": "images/1.mp3",
	"m_upload_name": "null",
	"m_upload_url": "null"
};
console.log(music_json);
var record_json = {
	"record_bool": "r_false",
	"r_wechat_time": "null",
	"r_wechat_url": "null",
	"r_wechat_amr": "null"
};
console.log(record_json);


var main_title = '我喜欢你❤️';
// console.log(main_title);
if (main_title == '' || main_title == 'null') { //允许标题为空
	document.title = '慢慢喜欢你';
}

var window_height = $(window).height();
console.log('window_height ->' + window_height);
var pure_words_content = theme_content['pure_words_content'];
var str_cursorChar;
var typed_bool;
var interval_pw_height;
var height_div_pw = $(".div_pure_words_height").height();
function init_pure_words() {
	$(".div_pure_words_height").html(pure_words_content + '22222'); //初始化复制内容，撑开文档高度            
	// 初始化设置div的bg图片 初始化设置div的bg图片
	if (typeof(theme_content['bg_style_pure_words']) != 'undefined' && theme_content['bg_style_pure_words'] == 'bg_opacity') {
		if (typeof(theme_content['bg_img']) != 'undefined' && theme_content['bg_img'] != '') {
			$(".div_pure_words_bg").css({
				"background-image": "url(" + theme_content['bg_img'] + ")"
			});
		}
	}
	//以下是打字效果的js 
	if (typeof(theme_content['cursor_char']) != 'undefined' && theme_content['cursor_char'] != '') {
		switch (theme_content['cursor_char']) { //设置打字光标的样式
		case 'cursor_heart':
			str_cursorChar = '<um style="color: #F44336;">❤</um>';
			break;
		case 'cursor_sub':
			str_cursorChar = '_';
			break;
		case 'cursor_music':
			str_cursorChar = '♫';
			break;
		case 'cursor_star':
			str_cursorChar = '★';
			break;
		case 'cursor_sun':
			str_cursorChar = '☀';
			break;
		default:
			str_cursorChar = '|';
		}
	} else { //处理全新作品，默认显示打字效果
		str_cursorChar = '❤';
	}
	//判断用户有没有选择打字效果
	if (typeof(theme_content['typed_bool']) != 'undefined' && theme_content['typed_bool'] != '') {
		typed_bool = theme_content['typed_bool'] == 'typed_y' ? true : false;
	} else {
		typed_bool = false; //默认显示打字效果
	}
	display_pure_words();
	$(".div_pure_words").fadeIn();
	interval_pw_height = setInterval(function() {
		console.log('div_pure_words_height -> ' + $('.div_pure_words_height').height());
		var least_height_div_pw = $('.div_pure_words_height').height();
		if (least_height_div_pw > height_div_pw) {
			height_div_pw = least_height_div_pw;
		} else {
			clearInterval(interval_pw_height);
			$(".div_pure_words_height").height(least_height_div_pw + 100);
			if ($(".div_pure_words_height").height() < window_height) {
				$(".div_pure_words_height").height(window_height); //不能小于窗口的高度
				console.log('let us be high as window');
			}
		}
	}, 100);
}

function display_pure_words() {
	if (typed_bool) {
		var typed_pure_words = new Typed('#span_pw_typed', {
			strings: [pure_words_content],
			//输入内容, 支持html标签
			typeSpeed: 120,
			//打字速度
			cursorChar: str_cursorChar,
			//替换光标的样式
			contentType: 'html',
			//值为html时，将打印的文本标签直接解析html标签
			onComplete: function(abc) {
				// console.log(abc); 
				console.log('finished typing words');
				// console.log($('#span_pw_typed').height()-$(".div_pure_words_height").height());
			},
		});
	} else {
		//如果不需要打字效果就直接显示
		$("#span_pw_typed").html(pure_words_content).fadeIn();
	}
	init_attachment();
}
var start_content = {
	chase_title: "做我女朋友好不好<um style='color: #F44336;'>💕</um>",
	chase_text: "承蒙你的出现，够我喜欢好多年，我希望，以后你能用我的名字拒绝所有人<um style='color: #F44336;'>💕</um>",
	chase_benefit: ['我会把全部工资都给你','每天做好吃的给你','你睡不着时给你讲故事','给你自由去做喜欢的事情',"你是我拔掉氧气罐都想吻的人", "你是我跑完8000米还想拥抱的人", "你是我自罚三杯都不肯开口的秘密", "你是我赴汤蹈火都不肯放下的执着", "你是我电量只剩1%也想回信息的人", "你是我穷极一生不想醒来的梦"],
	bg_style: "bg_custom",
	bg_img: "images/2.jpg",
	img_bool: "img_true",
	img_src: "images/1.gif"
}; //可能为null
console.log(start_content);
var start_id;
$(function() {
	//此事件为触发互动创意
	start_id = 'onlyyou'; //可能为null
	init_start(start_id);
});
function init_start(start_id) {
	console.log('init_start ->' + start_id);
	switch (start_id) {
	case 'loveformat':
		$('.div_loveformat').show();
		init_loveformat();
		break;
	case 'hearttree':
		$('#div_hearttree').show();
		init_hearttree();
		break;
	case 'courage':
		$('#div_courage').show();
		init_courage();
		break;
	case 'birthdaycake':
		$('#div_dbcake').show();
		init_birthdaycake();
		break;
	case 'intersect':
		$('#div_intersect').show();
		init_intersect();
		break;
	case 'onlyyou':
		$('#div_onlyyou').show();
		init_onlyyou();
		break;
	default:
		init_theme();
	}
}
//开始动画主体部分
function init_theme() {
	console.log('init_theme');
	$('#div_start_bg').fadeOut();
	init_pure_words();
}
var attachment = 'null'; //可能为null
var attached_content = {
	"bool_save": false
}; //可能为null
console.log(attached_content);

function init_attachment() { //开始attachment
	console.log('init_attachment ->' + attachment);
	switch (attachment) {
	case 'timer':
		init_at_timer();
		break;
	default:
		return;
	}
}
</script>
<!-- JQuery -->
<script src="js/typed.min.js"></script>
<script src="js/start_onlyyou.js"></script>
<script src="js/jweixin-1.2.0.js"></script>
<script src='js/theme_common.js'></script>
</body>
</html>